<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link rel="stylesheet" href="../../../static/layer/assets/css/layui.css">
    <link rel="stylesheet" href="../../../static/layer/assets/css/view.css"/>
    <script src="../../../static/layer/assets/echarts.min.js"></script>
    <script src="../../../static/js/jquery2.1.4.js"></script>
    <title>CareNote-Home</title>
    <link rel="shortcut icon" href="http://jimo.fun/img/my/jm.png"/>
    <style>
        .myColor {
            font-size: 14px;
            background: linear-gradient(to right, red, blue);
            -webkit-background-clip: text;
            color: transparent;
        }
    </style>
</head>
<body class="layui-view-body">
<div class="layui-content">
    <div class="layui-row layui-col-space20">
        <div class="layui-col-sm6 layui-col-md6">
            <div class="layui-card">
                <div class="layui-card-body chart-card">
                    <div class="chart-header">
                        <div class="metawrap">
                            <div class="meta">
                                <span>尊敬的用户：</span>
                            </div>
                            <div id="userName" class="total">JIMO</div>
                        </div>
                    </div>
                    <div class="chart-body">
                        <div class="contentwrap">
                        </div>
                    </div>
                    <div class="chart-footer">
                        <div class="field">
                            <span>注册时间：</span>
                            <span id="userDate">2022-8-15</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-col-sm6 layui-col-md6">
            <div class="layui-card">
                <div class="layui-card-body chart-card">
                    <div class="chart-header">
                        <div class="metawrap">
                            <div class="meta">
                                <span>余额剩余:</span>
                            </div>
                            <div id="userMoney" class="total">888</div>
                        </div>
                    </div>
                    <div class="chart-body">
                        <div class="contentwrap">
                        </div>
                    </div>
                    <div class="chart-footer">
                        <div class="field">
                            <span>最近三天消费：</span>
                            <span id="consumerMoney">88</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-col-sm6 layui-col-md6">
            <div class="layui-card">
                <div class="layui-card-body chart-card">
                    <div class="chart-header">
                        <div class="metawrap">
                            <div class="meta">
                                <span>您的专属消息模板:</span>
                            </div>
                            <div id="modulePrivate" class="total">3</div>
                        </div>
                    </div>
                    <div class="chart-body">
                        <div class="contentwrap">
                        </div>
                    </div>
                    <div class="chart-footer">
                        <div class="field">
                            <span>模板使用量:</span>
                            <span id="consumerModule">66</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-col-sm6 layui-col-md6">
            <div class="layui-card">
                <div class="layui-card-body chart-card">
                    <div class="chart-header">
                        <div class="metawrap">
                            <div class="meta">
                                <span>关怀对象数:</span>
                            </div>
                            <div id="settings" class="total">1</div>
                        </div>
                    </div>
                    <div class="chart-body">
                        <div class="contentwrap">
                        </div>
                    </div>
                    <div class="chart-footer">
                        <div class="field">
                            <span>关怀次数:</span>
                            <span id="consumerSetting">21</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="layui-col-sm12 layui-col-md12">
            <div class="layui-card">
                <div class="layui-tab layui-tab-brief">
                    <ul class="layui-tab-title">
                        <li class="layui-this">Care-Note实时大数据平台！
                            <input id="btnClose" type="button" class="myColor" value="想看背景雪花爱人，点这关闭浮动页面！" /></li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item layui-show">
                            <iframe src="/" style="width:100%;height:600px;"></iframe>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="../../../static/layer/assets/layui.all.js"></script>
<script src="../../../static/layer/layer.js"></script>
<script>
    var element = layui.element;
</script>
<script>
    $(function () {
        //1.    ajax与服务器交互
        //获取用户数据
        $.getJSON("/user/console/all", null, function (data) {
            if (data.status == 200) {
                $("#userName").html(data.data[0]);
                $("#userDate").html(data.data[1]);
                $("#userMoney").html(data.data[2]);
                $("#consumerMoney").html(data.data[3]);
                $("#modulePrivate").html(data.data[4]);
                $("#consumerModule").html(data.data[5]);
                $("#settings").html(data.data[6]);
                $("#consumerSetting").html(data.data[7]);
            }else {
                layer.msg("请求失败，请重试！");
            }
        });
        //获取用户数据
        //处理关闭窗口事件 这个脚本是 ie6和ie7 通用的脚本
        $("#btnClose").click(function () {
            let confirm = layer.confirm("您确定要关闭本页吗？❤如果失败请您单击小房子即可！",
                {btn:['确认','算了']},function () {
                    window.opener = null;
                    window.open('', '_self');
                    window.close();
                },function () {
                    layer.msg("已取消！");
                }
            );
        });
    });

</script>
</body>
</html>